/* Theme Name: Fullpane Theme URI: http://themify.me/themes/fullpane Version: 1.0.5 Description: Created by Themify. Author: Themify Author URI: http://www.themify.me License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html Copyright: (c) 2014 Themify. Tags: themify, featured-images, translation-ready, custom-menu, sidebar --------- DO NOT EDIT THIS FILE. If you need to overwrite the CSS styling, create a new custom_style.css in the theme folder and it will automatically load in the . -----------------------------------------------------------------------------------*/ /************************************************************************************ RESET *************************************************************************************/ html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset, figure { margin: 0; padding: 0; } img, fieldset { border: 0; } /* set img max-width */ img { max-width: 100%; height: auto; -moz-box-sizing: border-box; box-sizing: border-box; } /* ie 8 img max-width */ @media \0screen { img { width: auto;} } /* set html5 elements to block */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* audio */ audio { max-width: 100%; } /* iframe */ iframe { max-width: 100%; background: #fff; } /************************************************************************************ GENERAL STYLING *************************************************************************************/ body { font: 1em/1.7em 'Roboto', sans-serif, Arial; font-style: normal; font-weight: 300; color: #aaa; word-wrap: break-word; background: #222527; } a { text-decoration: none; outline: none; } a:hover { text-decoration: none; } a:focus { outline: none; } p { margin: 0 0 1.2em; padding: 0; } small { font-size: 87%; } blockquote { font: italic 110%/130% "Times New Roman", Times, serif; padding: 8px 30px 15px; } ins { text-decoration: none; } ::-moz-selection { color: #fff; background: #cf1924; } ::selection { color: #fff; background: #cf1924; } /* LIST ================================================ */ ul, ol { margin: 1em 0 1.4em 24px; padding: 0; line-height: 140%; } li { margin: 0 0 .5em 0; padding: 0; list-style: none; } /* HEADINGS ================================================ */ h1, h2, h3, h4, h5, h6 { line-height: 1.5em; margin: 20px 0 .4em; font-family: 'Roboto Condensed', Arial, sans-serif; font-style: normal; font-weight: 300; color: #fff; } h1 { font-size: 2em; font-family: 'Roboto', Arial, sans-serif !important; font-style: normal; font-weight: 300; } h2 { font-size: 1.8em; } h3 { font-size: 1.6em; } h4 { font-size: 1.4em; } h5 { font-size: 1.2em; } h6 { font-size: 1em; } /* FORM ================================================ */ /* form input */ input, textarea, select, input[type=search], button { font-size: 100%; font-family: inherit; } textarea, input[type=text], input[type=password], input[type=search], input[type=email], input[type=url] { background: #eee; border: none; padding: 6px 10px; -webkit-appearance: none; } input[type=text], input[type=search], input[type=email], input[type=url] { width: 240px; max-width: 90%; } input[type=text] { outline: none; } /* text area */ textarea { line-height: 150%; width: 94%; height: 200px; } /* form input:focus */ textarea:focus, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus, input[type=email]:focus, input[type=url]:focus { outline: none; background: #eee; } /* form button */ input[type=reset], input[type=submit], button { display: inline-block; margin-bottom: 0; text-align: center; vertical-align: middle; cursor: pointer; background-image: none; background: transparent; border: 1px solid #fff; white-space: nowrap; padding: 7px 15px; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; letter-spacing: 0.05em; font-size: 1em; line-height: 1.5em; color: #fff; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } /* form input:hover */ input[type=reset]:hover, input[type=submit]:hover, button:hover { color: #000; background-image: none; background-color: #fff; border-color: #fff; } /* reset form text align */ .section-post form { text-align: left; } /* DEFAULT COLOR ================================================ */ a, #header a:hover i, #main-nav a:hover, #main-nav .current_page_item a, #main-nav .current-menu-item a, #main-nav li:hover > a, #main-nav li:hover > a > i, .widget #wp-calendar th, .testimonial .testimonial-author, .gallery-info .post-category a:hover { color: #cf1924; } .section-post.gallery .gallery-slider-prev:hover, .section-post.gallery .gallery-slider-next:hover, .section-post.gallery .timer-bar, .pagenav .current, #footer-tab a { background: #cf1924; color: #fff; } .pagenav .current { border-color: #cf1924; } /************************************************************************************ STRUCTURE *************************************************************************************/ #pagewrap { padding-bottom: 80px; /* for fixed header space */ } .query-section #pagewrap { padding: 0; } /* main page width */ .pagewidth, .section-inner { width: 1160px; margin: 0 auto; } /* section fullwidth */ .sidebar-none.query-section #layout.pagewidth { width: 100% !important; max-width: 100% !important; } .sidebar-none.query-section .page-title, .sidebar-none.query-section .page-content { width: 1064px; max-width: 100%; margin-left: auto; margin-right: auto; } /* body (middle container) */ #body { max-width: 100%; overflow: hidden; } /* content */ #content { width: 830px; float: left; padding: 60px 0; } .sidebar-none #content { width: 100%; float: none; } /* sidebar */ #sidebar { width: 260px; float: right; padding: 50px 0 40px 0; } /* sidebar left */ .sidebar-left #content { float: right; } .sidebar-left #sidebar { float: left; } /*.query-section*/ .query-section #content { padding-top: 0; } /************************************************************************************ GRID *************************************************************************************/ .col4-1, .col4-2, .col4-3, .col3-1, .col3-2, .col2-1 { margin-left: 3.2%; float: left; } .col4-1 { width: 22.6%; } .col4-2, .col2-1 { width: 48.4%; } .col4-3 { width: 74.2%; } .col3-1 { width: 31.2%; } .col3-2 { width: 65.6%; } .col.first, .col4-1.first, .col4-2.first, .col4-3.first, .col3-1.first, .col3-2.first, .col2-1.first { margin-left: 0; clear: left; } /************************************************************************************ HEADER *************************************************************************************/ #headerwrap { background: #fff; position: fixed; bottom: 0; z-index: 999; width: 100%; } #header { height: 70px; position: relative; width: 94%; margin: auto; } #header a i, #header i { color: #222527; } /* SITE LOGO ================================================ */ #site-logo { margin: 0; line-height: 110%; float: left; padding: 15px 0; } #site-logo a { text-decoration: none; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 400; color: #000; text-transform: uppercase; } #site-logo a:hover { text-decoration: none; } /* SITE DESCRIPTION ================================================ */ #site-description { float: left; margin: 0; line-height: 110%; color: #aaa; font-size: small; font-style: normal; font-weight: 400; padding: 28px 15px; padding-bottom: 0; } /* SOCIAL WIDGET ================================================ */ #social-wrap { position: absolute; top: 10px; right: 0; } .social-widget { margin-left: 10px; display: inline-block; } .social-widget a { text-decoration: none; } .social-widget a:hover { text-decoration: none; } .social-widget .widget { display: inline-block; zoom:1; *display:inline; margin: 0 2px 0 0; padding: 0; background: none; border: none; border-radius: 0; box-shadow: none; } .social-widget .widget div { display: inline; } .social-widget .widgettitle { width: auto; font-weight: bold; font-size: 100%; font-family: inherit; text-transform: none; border: none; letter-spacing: 0; position: static; display: inline-block; zoom: 1; *display:inline; margin: 5px 8px 2px 0; padding: 0; background: transparent; border-radius: 0; box-shadow: none; } .social-widget ul { margin: 6px 0 0 !important; padding: 0; display: inline; } .social-widget ul li { font-size: 1.25em; margin: 0 8px 0 0; display: inline-block !important; zoom: 1; *display:inline; border: none !important; clear: none; line-height: 100%; } .social-widget ul li:first-child, .social-widget ul li { padding: 18px 2px 0 0 !important; } .social-widget ul li:last-child { margin-left: 0; } .social-widget ul li a { display: block; cursor: pointer; color: #222527 !important; } .social-widget ul li a:hover { color: #cf1924 !important; } /* rss */ .social-widget .rss { display: inline-block; position: relative; margin-top: 18px; } .social-widget .themify-social-links + .rss { margin-top: 0; } .social-widget .rss a:before { content: "\f09e"; line-height: 1; font-size: 1.25em !important; color: #222527 !important; padding: 6px !important; position: absolute; top: 0; left: 0; } .social-widget .rss a:hover:before { color: #cf1924 !important; } .social-widget .rss a { color: transparent; width: 20px; height: 0; } /* SEARCH FORM ================================================ */ #searchform-wrap { position: relative; float: right; margin: 18px -30px 0 0 ; z-index: 999; } #headerwrap #searchform { position: absolute; top: 0; right: 0; } #headerwrap #searchform #s { width: 0; background: transparent; color: #aaa; padding: 10px; margin: -5px 0 0; float: right; border: none; -webkit-transition: width .7s; -moz-transition: width .7s; transition: width .7s; } #headerwrap #searchform #s:focus, #headerwrap #searchform #s:hover, #headerwrap #searchform .fa-search:hover + #s { width: 180px; color: #000; background: #fff; border: 1px solid #aaa; } #headerwrap #searchform .fa-search { color: #222527; font-size: 1.25em; position: absolute; right: 4px; top: 4px; cursor: pointer; } /* MAIN NAVIGATION ================================================ */ #menu-icon-close { display: none; } #main-nav-wrap { float: right; } .secondarymenu-wrap { float: left !important; } #slide-nav { float: left !important; } #main-nav { margin: 0; padding: 0; width: auto; position: absolute; right: 0; } #main-nav li { margin: 0; padding: 0; list-style: none; float: left; position: relative; } /* main level link */ #main-nav a { font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; font-size: 1em; line-height: 1em; color: #aaa; display: block; padding: 20px 15px; margin: 0 0 0 1px; border-top: 4px solid #fff; height: 20px; text-decoration: none; } /* main level link :hover */ #main-nav a:hover, #main-nav .current_page_item a, #main-nav .current-menu-item a { border-top: 4px solid #cf1924; } /* current link */ #main-nav .menu-item-has-children > a:after, #main-nav .page_item_has_children > a:after, #main-nav .has-sub-menu > a:after { content: '\e809'; text-transform: none; font-size: .625em; line-height: 1em; position: absolute; top: 50%; right: 0; margin-top: -3px; } #main-nav ul .menu-item-has-children > a:after, #main-nav ul .has-sub-menu > a:after { content: '\e806'; position: relative; float: left; height: 10px; } /* sub-levels link */ #main-nav ul a, #main-nav .current_page_item ul a, #main-nav ul .current_page_item a, #main-nav .current-menu-item ul a, #main-nav ul .current-menu-item a { font-size: 1em; font-weight: 300; line-height: 1.25em; color: #aaa; text-transform: none; padding: 6px 12px; margin: 0; display: block; width: 165px; background: none; border: none; text-shadow: none; box-shadow: none; } /* sub-levels link :hover */ #main-nav ul a:hover, #main-nav .current_page_item ul a:hover, #main-nav ul .current_page_item a:hover, #main-nav .current-menu-item ul a:hover, #main-nav ul .current-menu-item a:hover { color: #222527; border: 0; } #main-nav ul li:hover > a { color: #222527; } /* dropdown ul */ #main-nav ul { margin: 0 0 15px -100px; padding: 5px 0; list-style: none; position: absolute; background: #fff; z-index: 100; right: 0; bottom: 100%; border: 1px solid #000; visibility: hidden; opacity: 0; } #main-nav ul:after { border-top: 8px solid #000000; border-left: 8px solid rgba(0, 0, 0, 0); border-right: 8px solid rgba(0, 0, 0, 0); content: " "; display: block; height: 0; right: 20px; margin-left: -4px; position: absolute; bottom: -9px; width: 0; z-index: -1; } #main-nav ul li { background: none; margin: 0; float: none; position: relative; border-top: 1px solid #ececec; text-align: right; } #main-nav ul li:first-child { border-top: none; } /* sub-levels dropdown */ #main-nav ul ul { left: auto; right: 100%; bottom: 4px; margin-bottom: -5px; } #main-nav ul ul:after { bottom: 10px; left: 178px; margin-right: 0; border-left: 8px solid #000; border-top: 8px solid transparent; border-bottom: 8px solid transparent; } #main-nav ul ul:before { display: none; } /* show dropdown ul */ #main-nav li:hover > ul { opacity: 1; visibility: visible; margin-bottom: -5px; } #main-nav li ul li:hover > ul { margin-right: -20px; } /*cart*/ #main-nav ul.cart a, #main-nav .current_page_item ul.cart a, #main-nav ul.cart .current_page_item a, #main-nav .current-menu-item ul.cart a, #main-nav ul.cart .current-menu-item a { border: 0; width: 80px; text-align: center; } #main-nav ul.cart { left: -30%; } /* mobile menu icon */ #menu-icon { display: none; } /************************************************************************************ PAGE *************************************************************************************/ /* page title */ .page-title { margin: 0; margin-bottom: 50px; text-align: center; font-family: 'Roboto', Arial, sans-serif; font-style: normal; font-weight: 100; padding: 0; font-size: 320%; line-height: 110%; color: #fff; } /************************************************************************************ SECTION POST TYPE *************************************************************************************/ .section-post { background-position: middle top !important; } .section-post.fullcover { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 100% 89.5%;; } .section-post.repeat { background-repeat: repeat !important; } .section-post.repeat-x { background-repeat: repeat-x !important; } .section-post.repeat-y { background-repeat: repeat-y !important; } .section-post.repeat-x { background-repeat: no-repeat !important; } .section-post { margin: 0 !important; text-align: center; } .section-title { margin: 0 auto; margin: 50px 0 30px; text-align: center; font-family:'Roboto', sans-serif, Arial; font-style: normal; font-weight: 100; color: #fff; padding: 0; font-size: 320%; line-height: 110%; } .section-subtitle { margin: 20px auto 60px auto; text-align: center; font-family: 'Roboto Condensed', Arial, sans-serif; font-style: normal; font-weight: 100; text-transform: uppercase; padding: 0; line-height: 130%; } .section-content { line-height: 1.6em; } .section-inner { padding-bottom: 90px; } .section-post.fullwidth .section-inner { width: 100% !important; } .sidebar-none .section-inner { width: 94%; margin-left: auto; margin-right: auto; overflow: hidden; } .sidebar1 .section-inner { padding: 10% 5% 8%; } /* One Page Scroll Plugin Styles */ body, html { margin: 0; padding: 0; } #superContainer { height: 100%; position: relative; } .section-post{ position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .section-post.table { display: table; width: 100%; } .tableCell { display: table-cell; vertical-align: middle; width: 100%; height: 100%; } .controlArrow { position: absolute; top: 50%; cursor: pointer; width: 0px; height: 0px; border-style: solid; margin-top: -38px; } .controlArrow.prev { left: 15px; width: 0px; border-width: 38.5px 34px 38.5px 0; border-color: transparent #fff transparent transparent; } .controlArrow.next { right: 15px; border-width: 38.5px 0 38.5px 34px; border-color: transparent transparent transparent #fff; } .scrollable { overflow: scroll; -ms-touch-action: none; } .easing { -webkit-transition: all 0.7s ease-out; -moz-transition: all 0.7s ease-out; -o-transition: all 0.7s ease-out; transition: all 0.7s ease-out; } #fullPage-nav { position: fixed; z-index: 100; margin-top: -32px; top: 50%; opacity: 1; } #fullPage-nav.right { right: 10px; } #fullPage-nav.left { left: 10px; } .fullPage-slidesNav { position: absolute; z-index: 4; left: 50%; opacity: 1; } .fullPage-slidesNav.bottom { bottom: 17px; } .fullPage-slidesNav.top { top: 17px; } #fullPage-nav ul, .fullPage-slidesNav ul { margin: 0; padding: 0; } #fullPage-nav li, .fullPage-slidesNav li { display: block; width: 14px; height: 13px; margin: 7px; position: relative; } .fullPage-slidesNav li { display: inline-block; } #fullPage-nav li a, .fullPage-slidesNav li a { display: block; position: relative; z-index: 1; width: 100%; height: 100%; cursor: pointer; text-decoration: none; } #fullPage-nav li .active span, .fullPage-slidesNav .active span { background: #333; } #fullPage-nav span, .fullPage-slidesNav span { top: 2px; left: 2px; width: 8px; height: 8px; border: 1px solid #000; background: rgba(0, 0, 0, 0); border-radius: 50%; position: absolute; z-index: 1; } .fullPage-tooltip { position: absolute; color: #fff; font-size: 14px; font-family: arial, helvetica, sans-serif; top: -2px; } .fullPage-tooltip.right { right: 20px; } .fullPage-tooltip.left { left: 20px; } .vertical-centered { display: inline-block; vertical-align: middle; line-height: normal; width: 100%; } /* FULLWIDTH SECTION ================================================ */ .section-post.fullwidth .section-inner { padding: 0; margin: 0; } /* MESSAGE SECTION ================================================ */ .section-post.message { font-size: 1.2em; text-align: center; } .section-post.message .section-content { width: 80%; margin: auto; } .section-post.message .section-title { font-size: 4em; } .section-post.message .section-content h1, .section-post.message .section-content h2, .section-post.message .section-content h3 { line-height: 1.4em; margin: 0 0 1em; } .section-post.message .section-content h1 { font-size: 1.5em; } .section-post.message .section-content h2 { font-size: 1.25em; } .section-post.message .section-content h3 { font-size: 1.15em; } /* VIDEO SECTION ================================================ */ .section-post .post-video { width: 80%; margin: auto; } /* GALLERY SECTION ================================================ */ .section-post.gallery { position: relative; text-align: center; } .section-post.gallery .section-inner { width: 100%; padding: 0; } .section-post.gallery .section-title { display: none; visibility: hidden; } /* gallery image holder */ .section-post.gallery .gallery-image-holder { width: 100%; display: block; } .gallery-info { z-index: 7; /* gallery centering, if not used, set position to relative for zindex to work */ position: absolute; top: 10%; bottom: 10%; left: 10%; right: 10%; text-align: center; } .gallery-info .gallery-title { font-size: 300%; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; } .gallery-info .post-category { position: relative; bottom: -30px; } .gallery-info > p { margin: 40px 0; } .gallery-info .gallery-date { color: rgba(255,255,255,.5); font-size: 80%; } .separator { margin: 10px 0; } .line { position: relative; top: 0; left: 50%; margin-left: -10px; border-bottom: 1px solid #cf1924; float: left; width: 20px; } /* gallery slider */ .section-post.gallery .gallery-slider-wrap { position: absolute; bottom: 0; width: 100%; height: 0px; background: #000; background: rgba(0,0,0,.3); } .section-post.gallery .gallery-slider-thumbs { margin: 0 0 0 43px; padding: 0; } .section-post.gallery .gallery-slider-thumbs li { padding: 0; list-style: none; float: left; } .section-post.gallery .gallery-slider-thumbs li a img { max-width: 100px; } .section-post.gallery .gallery-slider-thumbs li a, .section-post.gallery .gallery-slider-thumbs li a img { display: block; border: none; overflow: hidden; color: #000; } .section-post.gallery .gallery-slider-thumbs li a:hover img, .section-post.gallery .gallery-slider-thumbs li.current img { border: 3px solid #000 !important; } .section-post.gallery .gallery-slider-thumbs li.current a:hover img { cursor: default; border: none !important; } /* Themify WideGallery Plugin Styles */ .twg-wrap { position: relative; overflow: hidden; z-index: 10; } .twg-wrap .twg-deleteable, .twg-wrap .twg-behind { position: absolute; width: 100%; left: 0; top: 0; /* Preserve aspet ratio */ min-width: 100%; min-height: 100%; /* Set up proportionate scaling */ width: 100%; height: auto; } .twg-behind { z-index: 3; } .twg-deleteable { z-index: 5; } .twg-controls { z-index: 7; } .twg-loading { position: absolute; z-index: 9; top: 45%; bottom: 45%; left: 45%; right: 45%; } .twg-actions { display: none; } .gallery-caption .text-caption { display: inline-block; background: #fff; background: rgba(255,255,255,.8); color: #808080; color: rgba(51,51,51,.65); font-size: 1.14em; font-weight: 400; max-width: 85%; padding: 30px; margin: 10% 0 0; border-radius: 3px; } /* gallery centering */ .section-post.gallery .gallery-image-holder { display: block; } /* For nested portfolio pagination */ .shortcode.portfolio-multiple .portfolio-slider-nested .carousel-nav-wrap { z-index: 991; } /* Style for Gallery Thumbnails to float left */ .twg-controls .twg-list li { width: 100px !important; } /* Slider Loader Style */ .slideshow-slider-loader { position: relative; width: 100%; height: 50px; } /* gallery mode (best fit / fullcover) */ .best-fit { background: #000; } .best-fit-vertical img { top: 0 !important; left: 10% !important; right: 10% !important; width: auto !important; height: 100% !important; margin: auto !important; } .best-fit-horizontal img { top: 10% !important; left: 0 !important; bottom: 10% !important; width: 100% !important; height: auto !important; margin: auto !important; } /* HIGHLIGHT POST TYPE ================================================ */ .highlight.list-post .highlight-post, .highlight-post { text-align: center; } .highlight.list-post .highlight-post:first-child, .highlight-post:first-child { margin-top: 0 !important; } .highlight-post i { font-size: 5em; position: relative; display: block; padding: 25% 0; } .highlight-post .post-title { text-transform: uppercase; } .shortcode.highlight { margin-top: 45px; } .shortcode.highlight .post { padding-left: 0; } /* TEAM POST TYPE ================================================ */ .shortcode.team .post { padding-left: 0; text-align: left; } .shortcode.team .post-title { font-size: 1.5em; line-height: 1.2em; margin: 0 0 5px 0; text-transform: uppercase; } .shortcode.team .team-title { display: block; font-size: 70% !important; line-height: 125%; text-transform: capitalize; margin-top: 6px; opacity: .6; } .team-social-link i { font-size: 1.4em; line-height: 1em; margin: 0 4px 0; display: inline-block; } .team-post .post-image { float: left; display: block; overflow: hidden; margin-right: 20px !important; margin-bottom: 20px; } .shortcode.team .post-image img { border-radius: 100%; } /* team slider margin fix */ .shortcode.slider.team .carousel-wrap { margin-left: -30px; } .shortcode.slider.team .post { margin-left: 30px; } /* .team-social */ .shortcode.team .team-social a i { font-size: 1.5em; margin-right: 10px; } .shortcode.team .team-slider .team-social a i { font-size: 1.2em !important; } .shortcode.team.list-post .team-content-wrap, .shortcode.team.list-style .team-content-wrap { width: 70%; float: left; } /* skillset-wrap */ .shortcode.team.list-post .skillset-wrap { width: 25%; float: right; } .skillset-wrap h4 { font-family: 'Roboto Condensed', Arial, sans-serif; font-size: 1.25em; font-style: normal; font-weight: 100; text-transform: uppercase; line-height: 130%; margin: 0 0 20px 0; } .shortcode.team.list-post .skillset-wrap .progress-bar-wrap, .skillset-wrap .progress-bar-wrap { display: block; overflow: hidden; } .shortcode.team .skillset { list-style: none; margin: 0; color: #000; font-size: 0.875em; text-align: left; } .shortcode.team .skillset li { background: #eee; margin: 0 0 12px; border-radius: 5px; } .shortcode.team .skillset span { display: inline-block; padding: 5px 10px; border-radius: 5px 0 0 5px; font-family: 'Roboto Condensed', Arial, sans-serif; } .slider .team-slider .team-title { font-size: .75em !important; line-height: .85em !important; color: #aaa; text-transform: none; } .slider .team-slider .team-social { margin: 10px 0; } .slider .team-slider .post-content > p { display: inline-block; margin-top: 10px; } /* POST TYPE GRID AND SLIDER LAYOUT ================================================ */ /* post type grid */ .shortcode.grid4 li:nth-of-type(4n+1), .shortcode.grid3 li:nth-of-type(3n+1), .shortcode.grid2 li:nth-of-type(2n+1) { margin-left: 0; clear: left; } .shortcode.grid4 li, .shortcode.grid3 li, .shortcode.grid2 li { float: left; padding: 0; list-style: none; } .shortcode.grid4 li .post, .shortcode.grid3 li .post, .shortcode.grid2 li .post { float: none; margin-left: 0; width: auto; } /* post type slider */ .post-type-slider { margin: 0; padding: 0; } .post-type-slider li { margin: 0; padding: 0; list-style: none; } .shortcode.slider .post-type-slider { margin: 0; padding: 0 60px; overflow: hidden; } .shortcode.slider .post-type-slider .post { margin-top: 0; } /* PORTFOLIO POST TYPE ================================================ */ .query-portfolio.grid4 .portfolio-post, .query-portfolio.grid3 .portfolio-post, .query-portfolio.grid2 .portfolio-post, .shortcode.portfolio.grid4 .portfolio-post, .shortcode.portfolio.grid3 .portfolio-post, .shortcode.portfolio.grid2 .portfolio-post { margin: 0 !important; padding: 0; text-align: center; } .query-portfolio.grid4 .portfolio-post, .shortcode.portfolio.grid4 .portfolio-post { width: 25%; } .query-portfolio.grid3 .portfolio-post, .shortcode.portfolio.grid3 .portfolio-post { width: 33.3%; } .query-portfolio.grid2 .post, .shortcode.portfolio.grid2 .portfolio-post { width: 50%; } .query-portfolio.grid4 .portfolio-post .post-image, .query-portfolio.grid3 .portfolio-post .post-image, .query-portfolio.grid2 .portfolio-post .post-image, .shortcode.portfolio.grid4 .portfolio-post .post-image, .shortcode.portfolio.grid3 .portfolio-post .post-image, .shortcode.portfolio.grid2 .portfolio-post .post-image { margin: 0 !important; } .query-portfolio.grid4 .portfolio-post .post-image img, .query-portfolio.grid3 .portfolio-post .post-image img, .query-portfolio.grid2 .portfolio-post .post-image img, .shortcode.portfolio.grid4 .portfolio-post .post-image img, .shortcode.portfolio.grid3 .portfolio-post .post-image img, .shortcode.portfolio.grid2 .portfolio-post .post-image img { width: 100%; } .shortcode.portfolio .post-title { text-transform: uppercase; margin: 10px 0 20px; font-size: 1.5em; line-height: 1.6em; } .shortcode.portfolio.list-post .post-image { float: none; margin-right: 0; } .section-post.fullwidth .grid4 .portfolio-post .post-image, .section-post.fullwidth .grid3 .portfolio-post .post-image, .section-post.fullwidth .grid2 .portfolio-post .post-image { width: 100%; } /*.portfolio-post*/ .portfolio-post { margin-bottom: 0; overflow: hidden; min-height: 0 !important; } .portfolio-post .post-image { margin: 0; padding: 0; } .portfolio-post figure img { vertical-align: bottom; } .callaction-wrapper { text-align: center; } .portfolio .portfolio-post .post-content h1 { margin-top: 0; } .portfolio .portfolio-post .post-content h6 { color: rgba(255,255,255,0.4); font-weight: normal; margin: 0; } .portfolio .portfolio-post .post-content .line { border-bottom: 1px solid rgba(255,255,255,.7); } /* Portfolio hover effect */ body.grid4 .portfolio-post .post-content, body.grid3 .portfolio-post .post-content, body.grid2 .portfolio-post .post-content, .shortcode.portfolio.grid4 .post-content, .shortcode.portfolio.grid3 .post-content, .shortcode.portfolio.grid2 .post-content { position: absolute; left: 0; right: 0; top: 100%; bottom: 0; padding: 40px 40px 0 40px ; background: #cf1924; background: rgba(255,3,3,0.8); text-align: center; color: #fff; -webkit-transition: top 0.3s ease-out; -moz-transition: top 0.3s ease-out; -ms-transition: top 0.3s ease-out; -o-transition: top 0.3s ease-out; transition: top 0.3s ease-out; } .shortcode.portfolio.grid4 .post-content { padding: 20px 10% 0; } body.grid4 .portfolio-post:hover .post-content, body.grid3 .portfolio-post:hover .post-content, body.grid2 .portfolio-post:hover .post-content, .shortcode.portfolio.grid4 .portfolio-post:hover .post-content, .shortcode.portfolio.grid3 .portfolio-post:hover .post-content, .shortcode.portfolio.grid2 .portfolio-post:hover .post-content { zoom: 1; cursor: pointer; top: 0; } /* single portfolio */ .single-portfolio { margin-top: 40px; } .single-portfolio .post-image { float: left; width: 50%; margin-right: 40px; } .single-portfolio .post-title { font-size: 2em; line-height: 1.2em; margin: 0 0 40px 0; } .single-portfolio .post-content { text-align: left; padding-left: 0; } .single-portfolio .post-meta { position: relative; display: block; overflow: hidden; float: right; min-height: 300px; margin-left: 40px; } .single-portfolio .post-meta small { text-transform: uppercase; font-size: 0.85em; } .single-portfolio .post-meta a { color: #aaa; text-decoration: none; } .single-portfolio .post-meta a:hover { text-decoration: none; } .single-portfolio .callaction-wrapper { text-align: left; } .single-portfolio .post-nav { position: absolute; top: 20px; right: 10px; padding: 0; font-size: 1.25em; z-index: 999; } .single-portfolio .post-nav .next { float: left !important; text-align: left !important; } .single-portfolio .post-nav span { width: auto; } .single-portfolio .post-nav a i { color: #fff; opacity: .7; margin-left: 10px; } .single-portfolio .post-nav a:hover i { opacity: 1; } /* portfolio expanded */ #portfolio-clone { background: #111; } #portfolio-full .portfolio-expanded { position: fixed; top: 0; left: 0; width: 100%; background: #222527; margin: 0; overflow-x: hidden; } #portfolio-full .portfolio-expanded .pagewidth { padding-top: 80px; } #portfolio-full .portfolio-expanded .post-nav { top: 20px; } #portfolio-full .portfolio-expanded .post { width: 100% !important; padding-left: 0; padding-bottom: 80px; } #portfolio-full .portfolio-expanded .post-content { top: 0 !important; background: none !important; position: relative !important; text-align: left !important; color: #AAAAAA !important; padding: 0 !important; -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important; transition: none !important; } #portfolio-full .portfolio-expanded .post-image { margin-right: 40px !important; } #portfolio-full .portfolio-expanded .portfolio-post:hover .post-content { cursor: default !important; } #portfolio-full .portfolio-expanded .post-date { float: none !important; } #portfolio-full .portfolio-expanded .post-title { font-size: 1.75em !important; margin: 0 0 40px 0 !important; } /* Portfolio Expander Styles */ .portfolio-expanded { z-index: 1050; height: 100%; overflow: scroll; } .expanding{ background: #fff; position: absolute !important; } .expanding.done{ background: #222527; } /* portfolio zoom in */ .portfolio .portfolio-post:hover .post-image img { transform: scale(1.2, 1.2); -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -o-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); } /* PROGRESS BAR ================================================ */ .progress-bar { background: #eee; background: rgba(0,0,0,.1); margin: 25px 0 45px; text-align: left; color: #000; position: relative; height: 3px; } .progress-bar .progress-bar-bg { height: 3px; position: absolute; } .progress-bar .progress-bar-label { z-index: 1; font-style: normal; position: absolute; top: -25px; text-transform: uppercase; font-size: .9em; } /* TESTIMONIAL POST TYPE ================================================ */ .testimonial-post { text-align: center; } .testimonial ul li { list-style: none; margin: 0; padding: 0; } .testimonial-content { font-family: 'Roboto', Arial, sans-serif; font-style: normal; font-weight: 100; line-height: 120%; margin: 50px auto 0; padding: 0; text-align: center; } .shortcode.testimonial.slider .testimonial-content { font-size: 1.6em; margin: 0; } .testimonial .post-image { max-width: 140px; display: inline; text-align: center; } .testimonial .post-image img { border-radius: 50em; } /* testimonial pager */ .testimonial-pager { margin: 0; padding: 0; text-align: center; font-size: 0; } .testimonial-pager span { margin: 0; padding: 0; list-style: none; display: inline-block; } .testimonial-pager span a { width: 100px; height: 100px; } .testimonial-pager span a img { width: 100%; height: auto; opacity: .5; vertical-align: middle; } .testimonial-pager span a, .testimonial-pager span a img { display: block; border: none; overflow: hidden; border-radius: 0; } .testimonial-pager span a:hover img, .testimonial-pager span.selected img { opacity: 1; } .testimonial-pager span.selected a:hover { cursor: default; border: none !important; } .testimonial .testimonial-author { text-transform: uppercase; margin: 20px 0; font-size: 1.1em; } .testimonial .testimonial-author .testimonial-title { text-transform: none; color: rgba(255,255,255,.5); font-size: .8em; display: block; } .testimonial.slider .testimonial-post { padding: 0 10%; margin: 0 auto; } .testimonial.slider .carousel-nav-wrap .carousel-next, .testimonial.slider .carousel-nav-wrap .carousel-prev { display: none !important; } /*author-wrap*/ .testimonial .author-wrap { overflow: hidden; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; font-size: 1.5em; width: 25%; } .testimonial .author-wrap .post-image { float: left; margin-right: 20px; } .testimonial .author-wrap .testimonial-author { margin: 0; text-align: left; margin-top: 20px; } .testimonial .author-wrap .testimonial-author span { color: rgba(255,255,255,.7); font-size: 70%; } /* Testimonial Girds */ .testimonial.grid4 li:nth-of-type(4n+1), .testimonial.grid3 li:nth-of-type(3n+1), .testimonial.grid2 li:nth-of-type(2n+1) { margin-left: 0; clear: left; } .testimonial.grid4 li, .testimonial.grid3 li, .testimonial.grid2 li { float: left; margin-left: 3.2%; } .testimonial.grid4 li { width: 22.6%; } .testimonial.grid3 li { width: 31.2%; } .testimonial.grid2 li { width: 48.4%; } .testimonial.grid4 li .post, .testimonial.grid3 li .post, .testimonial.grid2 li .post { float: none; margin-left: 0; width: auto; } .list-post .testimonial.post { padding-left: 0; padding-right: 0; } /* testimonial speech bubble */ .testimonial.list-post .testimonial-content, .testimonial.grid4 .testimonial-content, .testimonial.grid3 .testimonial-content, .testimonial.grid2 .testimonial-content { background: #fff; color: #333; font-size: 100%; font-weight: 300; line-height: 150%; padding: 5% 5% 3%; position: relative; margin-bottom: 35px; border-radius: 3px; } .testimonial.grid4 .testimonial-content:before, .testimonial.grid3 .testimonial-content:before, .testimonial.grid2 .testimonial-content:before { content: ""; position: absolute; top: 100%; left: 30px; border-width: 0 0 20px 20px; border-style: solid; border-color: transparent #fff; } .testimonial.list-post .testimonial-content:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -10px; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 20px solid #fff; } .testimonial.grid4 .post-image, .testimonial.grid3 .post-image, .testimonial.grid2 .post-image { float: left; } .testimonial.grid4 .testimonial-author, .testimonial.grid3 .testimonial-author, .testimonial.grid2 .testimonial-author { margin: 5px 0 40px 30px; text-align: left; float: left; } /* AUTHOR PAGE ================================================ */ .author-bio { margin: 0 0 30px; } .author-bio .author-avatar { float: left; margin: 0 15px 0 0; } .author-name { font-size: 1em; font-weight: 300; text-transform: uppercase; } .author-bio .author-name { margin: 0 0 30px; padding: 0; } .author-body { overflow: hidden; zoom: 1; } .author-posts-by { margin: 0 0 20px; padding: 10px 0 0; font-size: 140%; text-transform: uppercase; border-top: double 4px #ccc; border-color: rgba(118,118,118,.3); } .author-bio .social-widget .widget { padding: 0 !important; margin: 0 !important; height: auto; } /* CATEGORY SECTIONS ================================================ */ .category-section { clear: both; margin-bottom: 30px; } /************************************************************************************ PAGE NAVIGATION *************************************************************************************/ .pagenav { clear: both; text-align: right; background-color: #f7f7f7F !important; position: relative; z-index: 1; margin: 20px 0; } .pagenav a, .pagenav span { text-decoration: none; display: inline-block; margin-bottom: 0; text-align: center; vertical-align: middle; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 7px 15px; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; letter-spacing: 0.05em; font-size: 1em; line-height: 1.5em; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .pagenav a { background-color: transparent; border-color: #4e5152; } .pagenav a:hover { background-color: #4e5152; } .pagenav .current { text-decoration: none; } .pagenav a.prev, .pagenav a.next { border: 0 !important; cursor: pointer; } .pagenav a.prev:hover, .pagenav a.next:hover { background: none; border: 0 !important; } /************************************************************************************ POST *************************************************************************************/ .post { margin-bottom: 40px; min-height: 150px; position: relative; } /* post content */ .post-content { min-width: 120px; overflow: hidden; } .post-content h1 { font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; } /* post title */ .post-title { margin: 0; padding: 0; color: #fff; } .post-title a { text-decoration: none; color: #fff !important; } .post-title a:hover { text-decoration: underline; } .post-tag { display: block; overflow: hidden; margin: 0 0 15px 0; } /* post image */ .post-image { margin: 0 0 30px; } .post-image.left { float: left; margin-right: 15px; } .post-image.right { float: right; margin-left: 15px; } /* lightbox zoom image */ .post-image .lightbox { position: relative; display: inline-block; zoom: 1; *display: inline; max-width: 100%; } .post-image .lightbox .zoom { width: 40px; height: 40px; background: url(images/icon-zoom.png) no-repeat center center; margin: -20px 0 0 -20px; position: absolute; top: 50%; left: 50%; z-index: 1000; } .post-image .lightbox:hover .zoom { background-color: #000; } /* list post */ .list-post .post { padding-left: 150px; position: relative; margin-bottom: 60px; min-height: 150px; } .list-post .post-title { margin: 0 0 20px 0; } .list-post .post-image { margin: 0 0 15px; } .list-post .post-meta { width: 120px; text-align: right; font-size: 80%; line-height: 90%; position: absolute; left: 0; top: 0; } .list-post .post-meta span { display: block; margin: 0 0 5px; } .list-post .post-meta em { font-size: 90%; } .list-post .post-meta .post-date { margin-bottom: 5px; } .list-post .post-meta .post-comment { font-size: 110%; } /* post meta */ .post-meta { margin: 0 0 10px; font-size: 80%; } .post-meta span { margin-right: 5px; } .post-meta .post-date { display: block; margin-bottom: 3px; clear: left; } .post-meta a { text-decoration: none; } .post-meta .post-author { overflow: hidden; vertical-align: middle; } .post-meta .post-author img { border-radius: 100%; } .post-meta small { position: relative; display: block; margin-top: 10px; font-size: 1em; line-height: 1.5em; } /* grid4 post */ body.grid4 .post, .loops-wrapper.grid4 .post { width: 22.6%; float: left; margin-left: 3.2%; padding-left: 0; } body.grid4 .post-title, .loops-wrapper.grid4 .post-title { font-size: 1.3em; margin: 0 0 10px; padding: 0; } body.grid4 .post-date, .loops-wrapper.grid4 .post-date { float: right; margin-right: 10px; } body.grid4 .post-image, .loops-wrapper.grid4 .post-image { margin: 0 0 10px; } body.grid4 .post-author img, .loops-wrapper.grid4 .post-author img{ width: 30px; height: 30px; float: left; margin-right: 10px; } /* grid3 post */ body.grid3 .post, .loops-wrapper.grid3 .post{ width: 31.2%; float: left; margin-left: 3.2% !important; padding-left: 0; } body.grid3 .post-title, .loops-wrapper.grid3 .post-title { font-size: 1.5em; margin: 0 0 10px; padding: 0; } body.grid3 .post-date, .loops-wrapper.grid3 .post-date { float: left; margin-right: 10px; } body.grid3 .post-image, .loops-wrapper.grid3 .post-image { margin: 0 0 20px; } body.grid3 .post-author img, .loops-wrapper.grid3 .post-author img { width: 40px; height: 40px; float: left; margin-right: 10px; } /* grid2 post */ body.grid2 .post, .loops-wrapper.grid2 .post { width: 48.4%; float: left; margin-left: 3.2%; padding-left: 0; } body.grid2 .post-title, .loops-wrapper.grid2 .post-title { font-size: 1.5em; margin: 0 0 10px; padding: 0; } body.grid2 .post-date, .loops-wrapper.grid2 .post-date { float: right; margin-right: 10px; } body.grid2 .post-image, .loops-wrapper.grid2 .post-image { margin: 0 0 20px; } body.grid2 .post-author img, .loops-wrapper.grid2 .post-author img { width: 40px; height: 40px; float: left; margin-right: 10px; } /* grid2-thumb post */ body.grid2-thumb .post, .loops-wrapper.grid2-thumb .post { width: 48.4%; float: left; margin-left: 3.2%; padding-left: 0; } body.grid2-thumb .post-title, .loops-wrapper.grid2-thumb .post-title { margin: 0; padding: 0; font-size: 150%; } body.grid2-thumb .post-image, .loops-wrapper.grid2-thumb .post-image { float: left; margin: 0 20px 15px 0; } body.grid2-thumb .post-content, .loops-wrapper.grid2-thumb .post-content { overflow: hidden; } /* list thumb post */ body.list-thumb-image .post-image, .loops-wrapper.list-thumb-image .post-image { float: left; margin: 0 20px 15px 0; } body.list-thumb-image .post-content, .loops-wrapper.list-thumb-image .post-content { overflow: hidden; } /* list large image */ body.list-large-image .post-image, .loops-wrapper.list-large-image .post-image { float: left; margin: 0 22px 10px 0; } body.list-large-image .post-title, .loops-wrapper.list-large-image .post-title { font-size: 200%; margin: 0; padding: 0; } body.list-large-image .post-content, .loops-wrapper.list-large-image .post-content { overflow: hidden; } /* clear grid posts */ .grid4 .post:nth-of-type(4n+1), .grid3 .post:nth-of-type(3n+1), .grid2 .post:nth-of-type(2n+1), .grid2-thumb .post:nth-of-type(2n+1) { margin-left: 0 !important; clear: left; } /*post-slider*/ .shortcode.post-slider { margin-top: 45px; } .post-slider .post-date { margin: 0; font-size: 80%; } /* List post */ .shortcode.list-post { max-width: 100%; margin: 0 auto; margin-top: 45px; } .shortcode.list-post .post.odd .post-image { float: right; margin-left: 7%; margin-right: auto; } /* section-post Girds */ .shortcode.list-post .grid4 .post-image, .shortcode.list-post .grid3 .post-image, .shortcode.list-post .grid2 .post-image { float: none; margin:0px; } .shortcode.list-post .grid4 .post-image img, .shortcode.list-post .grid3 .post-image img, .shortcode.list-post .grid2 .post-image img { width: 100%; height: auto; } .shortcode.list-post .grid4 .post-title, .shortcode.list-post .grid4 .post-meta, .shortcode.list-post .grid4 .post-content, .shortcode.list-post .grid3 .post-title, .shortcode.list-post .grid3 .post-meta, .shortcode.list-post .grid3 .post-content, .shortcode.list-post .grid2 .post-title, .shortcode.list-post .grid2 .post-meta, .shortcode.list-post .grid2 .post-content { text-align: left; } .shortcode.list-post .grid3 .post-meta { position: relative; } .shortcode.list-post .grid4 .post-meta > span, .shortcode.list-post .grid3 .post-meta > span, .shortcode.list-post .grid2 .post-meta > span { float: none; } .shortcode.list-post .grid4 .post-category, .shortcode.list-post .grid3 .post-category, .shortcode.list-post .grid2 .post-category{ position: absolute; bottom:0; right: 0; } /* edit post link */ .edit-button { display: block; clear: both; } /************************************************************************************ POST VIDEO (css for fluid video) *************************************************************************************/ .post-video, .embed-youtube { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; margin-bottom: 15px; } .post-video iframe, .post-video object, .post-video embed, .embed-youtube iframe, .embed-youtube object, .embed-youtube embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /************************************************************************************ AUTHOR BOX *************************************************************************************/ .author-box { margin: 100px 0; } .author-box .author-avatar { float: left; margin: 0 15px 5px 0; } .author-box .author-name { margin: 10px 0 15px; } .author-box img { border-radius: 100%; } .author-box .social-widget .links-list { margin-top: 0 !important; padding-top: 0 !important; } .author-box .social-widget .widget { margin-top: 0 !important; padding-top: 0 !important; } /************************************************************************************ POST NAVIGATION *************************************************************************************/ .post-nav { padding: 40px 0 0; clear: both; } .post-nav span { width: 47%; position: relative; } .post-nav a { clear: both; height: 68px; font-family: 'Roboto Condensed', Arial, sans-serif; font-style: normal; font-weight: 300; } .post-nav a i { opacity: .5; } .post-nav a:hover { text-decoration: none; color: #fff; } .post-nav a:hover i { opacity: 1; } .post-nav .prev { float: left; } .post-nav .next { float: right; text-align: right; } /* post nav arrow */ .post-nav span span { color: #fff; display: block; width: auto; float: left; width: 32px; height: 28px; font-size: 1.25em; margin-bottom: 50px; } .post-nav .next span { float: right; margin-right: 0; } /* arrow next */ .icon-arrow-next:before { content: '\e808'; } /* arrow previous */ .icon-arrow-prev:before { content: '\e806'; } /************************************************************************************ GALLERY POST FORMAT *************************************************************************************/ .gallery .section-inner { padding-bottom: 90px; padding-top: 40px; } .gallery-wrapper { width: auto; margin: 5% auto 80px auto; } .gallery-wrapper .item { display: inline-block; width: 250px; margin: 0 !important; -webkit-transition: left .4s ease-in-out, top .4s ease-in-out .4s; -moz-transition: left .4s ease-in-out, top .4s ease-in-out .4s; -ms-transition: left .4s ease-in-out, top .4s ease-in-out .4s; -o-transition: left .4s ease-in-out, top .4s ease-in-out .4s; transition: left .4s ease-in-out, top .4s ease-in-out .4s; background: rgba(238,44,73,1); } .gallery-wrapper .item img { display: block; width: 100%; height: auto; margin: 0 !important; padding: 0 !important; } .gallery-wrapper .item a span { display: none; } .gallery-wrapper .featured { width: 500px; } .gallery-wrapper .featured img { display: block; width: 500px; height: auto; } .gallery-wrapper .item a:hover img { opacity: .5; } .gallery-wrapper .item a:hover span { display: block; position: absolute; text-align: center; top: 0; color: #fff; padding: 40px; } .single .gallery .post-title { font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; text-align: center; margin: 0 0 .4em; } .single .gallery .post-category { text-align: center; display: block; } /************************************************************************************ COMMENTS *************************************************************************************/ .commentwrap { margin: 100px 0 60px; position: relative; clear: both; } /* comment title */ .comment-title, #reply-title { font-size: 140%; margin: 0 0 10px; padding: 0; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; } .comment-title { position: relative; z-index: 1; overflow: hidden; font-family: 'Roboto Condensed', Arial, sans-serif; font-style: normal; font-weight: 300; text-transform: uppercase; margin-bottom: 30px; color: #fff; } .comment-title:after { position: absolute; top: 51%; overflow: hidden; width: 98%; margin-left: 2%; height: 1px; content: '\a0'; background-color: #4E5152; } /* comment pagenav */ .commentwrap .pagenav { margin: 10px 0; border: none; box-shadow: none; } .commentwrap .pagenav.top { margin: 0; position: absolute; top: 0; right: 0; } /* commentlist */ .commentlist { margin: 0 0 30px; padding: 5px 0 0; border-top: solid 0 #424446; } .commentlist li { margin: 0; padding: 30px 0 0; list-style: none; position: relative; } .commentlist li:first-child{ padding-top: 0 !important; } .commentlist li:first-child .reply { top: 1px; } .commentlist li li:first-child { padding-top: 30px !important; } .commentlist li li:first-child .reply { top: 40px; } .commentlist .comment-author { margin: 2px 0 10px; padding: 0; } .commentlist .avatar { float: left; margin: 0 15px 0 0; } .comment-author img { border-radius: 100%; } .commentlist cite { font-style: normal; font-size: 1em; font-weight: 300; text-transform: uppercase; color: #fff; } .commentlist cite a { text-decoration: none; } .commentlist .bypostauthor > .comment-author cite { background: url(images/icon-author-comment.png) no-repeat 0 2px; padding-left: 18px; } .commentlist .comment-time { font-size: 75%; text-transform: uppercase; color: #aaa; } .commentlist .commententry { border-bottom: solid 1px #424446; position: relative; min-height: 40px; overflow: hidden; padding-bottom: 15px; word-wrap: break-word; } .commentlist ul, .commentlist ol { margin: 0 0 0 7%; padding: 0; } /* reply link */ .commentlist .reply { position: absolute; right: 0; top: 40px; } .commentlist .comment-reply-link { font-size: 11px; text-transform: uppercase; text-decoration: none; } .commentlist .comment-reply-link:hover { text-decoration: none; } /* COMMENT FORM ================================================ */ #respond { margin: 60px 0; padding: 10px 0 0; position: relative; clear: both; } #commentform { margin: 15px 0 0; } #commentform input[type=text] { width: 206px; margin-right: 5px; } #commentform label { font-weight: normal; } #commentform label small { font-weight: normal; } #commentform textarea { height: 140px; } #commentform input#submit { padding: 7px 20px; } /************************************************************************************ SLIDESHOW *************************************************************************************/ .slideshow-wrap { visibility: hidden; height: 0; overflow: hidden; min-width: 120px; } .slideshow { margin: 0; padding: 0; } .slideshow li { margin: 0; padding: 0; float: left; list-style: none; overflow: hidden; text-align: center; position: relative; } .single .slideshow li { position: relative; } .caroufredsel_wrapper { margin: 0 auto; } /* slider image caption */ .slider-image-caption { position: absolute; background-color: #222; background-color: rgba(0,0,0,.6); color: #fff; display: inline; bottom: 0; left: 0; padding: 5px 2%; width: 96%; } /************************************************************************************ PORTFOLIO SINGLE *************************************************************************************/ .single .portfolio.post { padding-left: 0; } .sidebar-none .portfolio.post { margin-bottom: 0; } .sidebar-none.single-portfolio .post-image { float: left; margin-right: 6%; } /* portfolio details */ .single .portfolio .post-content { overflow: hidden; } /************************************************************************************ SIDEBAR *************************************************************************************/ .widget { margin: 0 0 60px; word-wrap: break-word; } .widgettitle { position: relative; z-index: 1; overflow: hidden; font-family: 'Roboto Condensed', Arial, sans-serif; font-style: normal; font-weight: 300; text-transform: uppercase; margin-bottom: 30px; color: #fff; } .widgettitle:after { position: absolute; top: 51%; overflow: hidden; width: 95%; margin-left: 5%; height: 1px; content: '\a0'; background-color: #4E5152; } .widget ul { margin: 0; padding: 0; } .widget li { margin: 0; padding: 15px 0; list-style: none; clear: both; border-top: solid 1px #424446; } .widget li:first-child { border: 0; padding-top: 0; } .widget ul ul { margin: 0; padding: 0; border-top: none; } .widget ul ul li { margin: 0; padding-left: 10px; } .widget ul ul li:last-child { padding-bottom: 0; } /* search widget */ .widget_search .fa-search { display: none; } /************************************************************************************ WIDGET STYLES *************************************************************************************/ /* calendar widget */ .widget #wp-calendar caption { text-transform: uppercase; padding-bottom: 15px; } .widget #wp-calendar td { font-weight: normal; width: 31px; padding: 4px 2px; text-align: center; } .widget #wp-calendar td#prev, .widget #wp-calendar td#next { padding: 0; text-align: left; } .widget #wp-calendar th { font-weight: normal; } .widget #wp-calendar tr { font-weight: normal; color: #aaa; } /* feature posts widget */ .widget .feature-posts-list br { display: none; } .widget .feature-posts-list .post-img { margin: 4px 30px 10px 0; float: left; overflow: hidden; } .widget .feature-posts-list small { font-style: italic; font-size: 90%; display: block; margin: 0 0 3px; } .widget .feature-posts-list .feature-posts-title { margin: 4px 0 3px; } .widget .feature-posts-list .post-excerpt { display: block; } /* twitter widget */ .widget .twitter-list .twitter-timestamp a { font-style: italic; font-size: 90%; } .widget .follow-user { margin: 0; padding: 5px 0; } /* links widget */ .widget .links-list img, .widget_links img { vertical-align: middle; } /* recent comments widget */ .recent-comments-list .avatar { margin-right: 12px; float: left; } /* flickr widget */ .widget .flickr_badge_image { margin-top: 10px; } .widget .flickr_badge_image img { width: 50px; height: 50px; margin-right: 12px; margin-bottom: 12px; float: left; } /* flickr widget - sidebar */ #sidebar .widget .flickr_badge_image { width: 23.125%; margin: 0 2.5% 2.5% 0; float: left; } #sidebar .widget .flickr_badge_image img { width: 100%; height: auto; max-width: 70px; max-height: 70px; vertical-align: bottom; margin: 0; float: none; } #sidebar .widget .flickr_badge_image:nth-of-type(4n) { margin-right: 0; } /* search widget */ #sidebar #searchform { position: static; } #sidebar #searchform #s { width: 93%; } /* reset twitter embed max-width to 100% */ #content .twitter-tweet-rendered { max-width: 100% !important; } #content .twt-border { max-width: 100% !important; min-width: 180px !important; } /************************************************************************************ FOOTER *************************************************************************************/ #footerwrap { position: fixed; top: 0; z-index: 999; width: 100%; } #footerwrap-inner { background-color:rgba(0,0,0,0.8); display: none; } #footer { clear: both; } /* footer widgets */ #footerwrap .footer-widgets { padding: 1em 0 0; } /* footer text */ .footer-text { clear: left; font-size: 85%; padding: 1em 0 1em; margin: 0; color: #aaa; } .footer-text a { color: #aaa; text-decoration: none; } .footer-text a:hover { color: #fff; text-decoration: underline; } #footer-tab { /*position: absolute;*/ position: relative; /*width: 80px;*/ width: auto; height: 44px; /*left: 50%;*/ margin: 0 0 0 -40px; margin-left: auto; margin-right: auto; } #footer-tab a { width: 80px; height: 36px; font-size: 28px; padding-top: 8px; display: block; margin-left: auto; margin-right: auto; text-align: center; } #footer-tab a:after { content: '\e805'; } .expanded #footer-tab a:after { content: '\e804'; font-size: 24px; } /************************************************************************************ WORDPRESS POST FORMATTING *************************************************************************************/ img.alignleft, img.aligncenter, img.alignright, img.alignnone { margin-bottom: 15px; } .alignleft { float: left; margin-right: 30px; } .alignright { float: right; margin-left: 30px; } .aligncenter { text-align: center; display: block; margin-left: auto; margin-right: auto; } .wp-caption { text-align: center; margin-bottom: 15px; max-width: 100%; } .wp-caption-text { font-style: italic; font-size: 95%; line-height: 120%; margin: 6px 0; } /************************************************************************************ GALLERY *************************************************************************************/ #body .gallery { margin: 0 0 20px 0; } /* gallery item */ #body .gallery .gallery-item { margin: 0; vertical-align: top; width: auto; float: left; text-align: center; } #body .gallery img { border: none; vertical-align: middle; width: 100%; } /* gallery caption */ #body .gallery .gallery-caption { line-height: 1.2em; font-size: .875em; text-align: center; margin: 5px 0 0; } /* GALLERY COLUMN ================================================ */ /* gallery column 1 (display all in one line) */ #body .gallery-columns-1 .gallery-item { width: auto; } #body .gallery-columns-1 br { display: none !important; } /* gallery column 2 */ #body .gallery-columns-2 .gallery-item { width: 50%; } /* gallery column 3 */ #body .gallery-columns-3 .gallery-item { width: 33.3%; } /* gallery column 4 */ #body .gallery-columns-4 .gallery-item { width: 25%; } /* gallery column 5 */ #body .gallery-columns-5 .gallery-item { width: 20%; } /* gallery column 6 */ #body .gallery-columns-6 .gallery-item { width: 16.6%; } /* gallery column 7 */ #body .gallery-columns-7 .gallery-item { width: 14.2%; } /* gallery column 8 */ #body .gallery-columns-8 .gallery-item { width: 12.5%; } /* gallery column 9 */ #body .gallery-columns-9 .gallery-item { width: 11.11%; } /* set gallery item margin-right */ #body .gallery-columns-1 .gallery-item, #body .gallery-columns-2 .gallery-item, #body .gallery-columns-3 .gallery-item, #body .gallery-columns-4 .gallery-item, #body .gallery-columns-5 .gallery-item, #body .gallery-columns-6 .gallery-item, #body .gallery-columns-7 .gallery-item, #body .gallery-columns-8 .gallery-item, #body .gallery-columns-9 .gallery-item { margin-right: 0; margin-bottom: 0; } /* clear gallery item margin-right */ #body .gallery-columns-9 .gallery-item:nth-of-type(9n), #body .gallery-columns-8 .gallery-item:nth-of-type(8n), #body .gallery-columns-7 .gallery-item:nth-of-type(7n), #body .gallery-columns-6 .gallery-item:nth-of-type(6n), #body .gallery-columns-5 .gallery-item:nth-of-type(5n), #body .gallery-columns-4 .gallery-item:nth-of-type(4n), #body .gallery-columns-3 .gallery-item:nth-of-type(3n), #body .gallery-columns-2 .gallery-item:nth-of-type(2n) { margin-right: 0; } /************************************************************************************ SHORTCODE *************************************************************************************/ /* HR ================================================ */ hr { border-color: #4f4f4f; margin: 40px 0; } /* BUTTON STYLES ================================================ */ a.shortcode.button { display: inline-block; margin-bottom: 0; text-align: center; vertical-align: middle; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 7px 15px; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 300; text-transform: uppercase; letter-spacing: 0.05em; font-size: 1em; line-height: 1.5em; border-radius: 4px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none } a.shortcode.button:hover { color: #333333; text-decoration: none; } /* color */ a.shortcode.button.outline { color: #fff; background-color: transparent; border-color: #fff; box-shadow: none; text-shadow: none; } a.shortcode.button.outline:hover { color: #000; background-image: none; background-color: #fff; border-color: #fff; } a.shortcode.button.flat { box-shadow: none; text-shadow: none; } a.shortcode.button.yellow { background-color: #fc0 !important; } a.shortcode.button.yellow:hover { background-color: #fff21e !important; } a.shortcode.button.orange { background-color: #ff9f40 !important; } a.shortcode.button.orange:hover { background-color: #FFB95A !important; } a.shortcode.button.blue { background-color: #22d9e5 !important; } a.shortcode.button.blue:hover { background-color: #3CF3FF !important; } a.shortcode.button.outline.green { color: #02daaf !important; border-color: #02daaf; } a.shortcode.button.outline.green:hover { color: #fff !important; background-color: #02daaf; border-color: #02daaf; } a.shortcode.button.outline.red { color: #cf1924 !important; border-color: #cf1924; } a.shortcode.button.outline.red:hover { color: #fff !important; background-color: #cf1924; border-color: #cf1924; } a.shortcode.button.black { background-color: #000 !important; } a.shortcode.button.black:hover { background-color: #444 !important; } a.shortcode.button.purple { background-color: #c594da !important; } a.shortcode.button.purple:hover { background-color: #DFAEF4 !important; } a.shortcode.button.gray { background-color: #888888 !important; } a.shortcode.button.gray:hover { background-color: #adadad !important; } a.shortcode.button.pink { background-color: #fca8bc !important; } a.shortcode.button.pink:hover { background-color: #FFC2D6 !important; } /* button size */ a.shortcode.button.small { font-size: .8em; font-weight: normal; padding: 3px 10px 4px; } a.shortcode.button.large { font-size: 1.25em; font-weight: normal; padding: 13px 30px 14px; } a.shortcode.button.xlarge { font-size: 1.5em; padding: 12px 30px 15px; font-family: 'Roboto Condensed', Arial, sans-serif !important; font-style: normal; font-weight: 100; } /* button shape */ a.shortcode.button.rounded { border-radius: 3px; } hr.red { border-color: #e74c3c; } hr.blue { border-color: #22d9e5; } hr.purple{ border-color: #c594da; } hr.green { border-color: #02daaf; } hr.pink { border-color: #fca8bc; } hr.orange { border-color: #ff9f40; } .shortcode.slider, .shortcode.post-slider { position: relative; } /************************************************************************************ CAROUSEL STYLES *************************************************************************************/ /* GALLERY SLIDER ================================================ */ .section-post.gallery .gallery-slider-controller { width: 100%; } .gallery-slider-prev { left: 0; } .gallery-slider-prev:after { content: '\e803'; } .gallery-slider-next { right: 0; } .gallery-slider-next:after { content: '\e806'; } .gallery-slider-next.carousel-next:after, .gallery-slider-prev.carousel-prev:after { position: absolute; top: 50%; right: auto; bottom: auto; left: 50%; margin: -8px 0 0 -8px; } .section-post.gallery .gallery-slider-prev, .section-post.gallery .gallery-slider-next { width: 43px; height: 100%; background: #000; position: absolute; top: 0; } .section-post.gallery .gallery-slider-prev, .section-post.gallery .gallery-slider-next { color: #fff; } /* gallery slider timer */ .section-post.gallery .gallery-slider-timer { position: absolute; height: 2px; width: 100%; top: -2px; } .section-post.gallery .timer-bar { height: 2px; } /* portfolio-multiple */ .shortcode.portfolio-multiple .carousel-wrap { position: relative; } .shortcode.portfolio-multiple .carousel-wrap img { width: 100%; vertical-align: bottom; } .shortcode.portfolio-multiple .carousel-prev, .shortcode.portfolio-multiple .carousel-next { text-indent: -999em; display: none !important; } .shortcode.portfolio-multiple .post .carousel-prev, .shortcode.portfolio-multiple .post .carousel-next { display: inline-block !important; } .shortcode.portfolio-multiple .post .carousel-pager { display: none !important; } .shortcode.portfolio .post-image img { width: 100%; vertical-align: bottom; } .shortcode.portfolio .post-image { margin: 0 !important; padding: 0; overflow: hidden; } /* portfolio single item carousel nav position */ .post.portfolio .carousel-nav-wrap, .shortcode.portfolio-multiple .portfolio-post .carousel-nav-wrap { position: absolute; top: 50%; bottom: auto; margin-top: -19px; } /* portfolio slideshow nav */ .portfolio .carousel-pager { margin-top: 30px; } /* testimonial carousel pager overwrite*/ .shortcode.post-slider .carousel-pager, .shortcode.slider .carousel-pager { clear: both; text-align: center; display: inline-block; zoom:1; *display:inline; vertical-align: middle; width: auto; margin: 0; padding: 0; } .shortcode.post-slider .carousel-pager a, .shortcode.slider .carousel-pager a { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.2) !important; border: medium none !important; border-radius: 10em !important; box-shadow: none !important; cursor: pointer; display: inline-block !important; height: 12px !important; margin: 0 3px !important; position: relative !important; text-indent: -900em; vertical-align: middle; width: 12px !important; } .shortcode.post-slider .carousel-pager a:hover, .shortcode.slider .carousel-pager a:hover { background: #fff !important; } .shortcode.post-slider .carousel-pager a.selected, .shortcode.slider .carousel-pager a.selected{ background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important; border: 1px solid #FFFFFF !important; } /* slideshow nav wrap */ .post .carousel-nav-wrap, .slider .carousel-nav-wrap { width: 100%; padding: 0; margin: 0; } .post .carousel-prev, .post .carousel-next, .slider .carousel-prev, .slider .carousel-next, .shortcode.slider .carousel-prev, .shortcode.slider .carousel-next, .shortcode.post-slider .carousel-prev, .shortcode.post-slider .carousel-next { position: absolute !important; width: 46px !important; height: 38px !important; display: block; font-size: 2em !important; background-color: transparent; border: none; box-shadow: none; top:0; margin: 0; padding: 0; color: #fff !important; opacity: .5; text-decoration: none; text-indent: -999em; text-shadow: none; } .carousel-prev, .carousel-next { display: block; } /*icon font arrows*/ .shortcode.post-slider .carousel-prev:after, .shortcode.slider .carousel-prev:after, .carousel-prev:after { content: '\e806'; line-height: 1em; position: absolute; top: 0; left: 0; text-indent: 0; } .shortcode.post-slider .carousel-next:after, .shortcode.slider .carousel-next:after, .carousel-next:after { content: '\e808'; line-height: 1em; position: absolute; top: 0; right: 0; text-indent: 0; } .carousel-nav-wrap a:hover { opacity: 1; } .post .carousel-prev, .post .carousel-prev:hover, .slider .carousel-prev, .slider .carousel-prev:hover, .shortcode.portfolio-multiple .post .carousel-prev { left: 0; } .post .carousel-next, .post .carousel-next:hover, .slider .carousel-next, .slider .carousel-next:hover .shortcode.portfolio-multiple .post .carousel-next { right: 0; } .post .carousel-pager, .slider .carousel-pager { width: 100%; text-align: center; padding: 0; clear: both; height: auto; padding: 15px 0; } .post .carousel-pager li, .slider .carousel-pager li { margin: 0; padding: 0; display: inline-block; zoom:1; *display:inline; position: relative; } .shortcode.testimonial.slider .carousel-pager a { text-indent: -900em; max-width: 100px; width: auto !important; height: auto !important; display: block !important; margin: 0 !important; cursor: pointer; background: rgba(255, 255, 255, 0.2) !important; border: none !important; position: relative !important; vertical-align: middle; border-radius: 0 !important; box-shadow: none !important; } .post .carousel-pager a:hover, .slider .carousel-pager a:hover { background: rgba(255, 255, 255, 1) !important; } .post .carousel-pager .selected, .slider .carousel-pager .selected, .post .carousel-pager .selected:hover, .slider .carousel-pager .selected:hover { border: 3px #cf1924 solid !important; background: transparent !important; } /* carousel loader icon */ .portfolio-loader { display: none; width: 54px; height: 54px; position: absolute; top: 50%; left: 50%; margin: -44px 0 0 -25px; background: #fff url(images/load.gif) center no-repeat; border-radius: 10em; } /* STYLE RESETS ================================================ */ .shortcode.post-slider .carousel-wrap, .shortcode.slider .carousel-wrap { margin-bottom: 0 !important; } .shortcode.post-slider .carousel-prev, .shortcode.slider .carousel-prev, .shortcode.post-slider .carousel-next, .shortcode.slider .carousel-next { color: transparent !important; background-color: transparent !important; background-image: none; box-shadow:none; font-size: 2em; } .shortcode.post-slider .carousel-prev:hover, .shortcode.slider .carousel-prev:hover, .shortcode.post-slider .carousel-next:hover, .shortcode.slider .carousel-next:hover { opacity: 1 !important; } .shortcode.post-slider .post-image img { width: 100%; height: auto; } .shortcode.post-slider .post-title { font-size: 1.45em; } .shortcode.post-slider .carousel-nav-wrap, .shortcode.slider .carousel-nav-wrap { border: medium none; margin: 10px auto 20px; text-align: center; } .shortcode.post-slider .carousel-prev, .shortcode.post-slider .carousel-next, .shortcode.slider.team .carousel-prev, .shortcode.slider.team .carousel-next { position: relative !important; font-size: 1em !important; width: 20px !important; height: 17px !important; vertical-align: bottom; } /************************************************************************************ BUILDER *************************************************************************************/ .section-post .module { text-align: left; } .module-post .post { min-height: 0; } .module-post .post-meta { width: auto; position: static; text-align: left; } .module-post .post-meta .post-author { display: none; } .module-post .post-meta .post-date, .module-post.list-post .post-meta span, .module-post .list-post .post-meta span { display: inline-block !important; margin-right: 5px !important; float: none; } .module-portfolio .portfolio-post .post-date { float: none; } .module-highlight .highlight-post .post-image img { vertical-align: middle !important; } .module-slider .carousel-nav-wrap .carousel-prev, .module-slider .carousel-nav-wrap .carousel-next { position: relative !important; text-indent: -999em !important; font-size: 1em !important; width: 16px !important; height: 16px !important; } .module .carousel-pager a { background: none repeat scroll 0 0 rgba(255, 255, 255, 0.2) !important; border: medium none !important; border-radius: 10em !important; box-shadow: none !important; cursor: pointer; display: inline-block !important; height: 12px !important; margin: 0 3px !important; position: relative !important; text-indent: -900em; vertical-align: middle; width: 12px !important; } .module .carousel-pager a:hover, { background: #fff !important; } .module .carousel-pager a.selected { background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important; border: 1px solid #FFFFFF !important; } .module.ui .tab-content, .module.ui.window .content, .module.ui.module-accordion .accordion-content { color: #aaa; } /* testimonial speech bubble */ .module-testimonial.list-post .testimonial-content, .module-testimonial.grid4 .testimonial-content, .module-testimonial.grid3 .testimonial-content, .module-testimonial.grid2 .testimonial-content { background: #fff; color: #333; font-size: 100%; font-weight: 300; line-height: 150%; padding: 5% 5% 3%; position: relative; margin-bottom: 35px; border-radius: 3px; } .module-testimonial.grid4 .testimonial-content:before, .module-testimonial.grid3 .testimonial-content:before, .module-testimonial.grid2 .testimonial-content:before { content: ""; position: absolute; top: 100%; left: 30px; border-width: 0 0 20px 20px; border-style: solid; border-color: transparent #fff; } .module-testimonial.list-post .testimonial-content:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -10px; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 20px solid #fff; } .module-testimonial.grid4 .post-image, .module-testimonial.grid3 .post-image, .module-testimonial.grid2 .post-image { float: left; } .module-testimonial.grid4 .testimonial-author, .module-testimonial.grid3 .testimonial-author, .module-testimonial.grid2 .testimonial-author { text-align: left !important; clear: none !important; float: left; } /************************************************************************************ PIE CHART *************************************************************************************/ .easyPieChart { position: relative; text-align: center; margin: 0 auto; max-width: 100%; } .easyPieChart img { border-radius: 0; vertical-align: middle; } .easyPieChart canvas { position: absolute; top: 0; left: 0; max-width: 100%; } /************************************************************************************ CLEAR / ALIGNMENT / INLINE *************************************************************************************/ .clear { clear: both; } .left { float: left; } .right { float: right; } .textleft { text-align: left; } .textright { text-align: right; } .textcenter { text-align: center; } .vertical{ vertical-align: middle; display: table-cell; } .list-inline { padding-left: 0; list-style: none; } .list-inline > li { display: inline-block; padding-left: 5px; padding-right: 5px; } .list-inline > li:first-child { padding-left: 0; } .clear-left{ left: 0; } /* clearfix */ .clearfix:after, .widget li:after, #body:after, #footer:after, footer:after, .pagenav:after, #main-nav:after, .menu:after, .gallery:after, #content:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix, .widget li, #body, #footer, footer, .pagenav, #main-nav, .menu, .gallery, #content { display: inline-block; } /* clearfix for ie7 */ .clearfix, .widget li, #body, #footer, footer, .pagenav, #main-nav, .menu, .gallery, #content { display: block; zoom: 1; } /************************************************************************************ LOADER *************************************************************************************/ .themify-loader{ width: 50px; position: absolute; top: 50%; left: 50%; margin: -25px 0 0 -18px; } .themify-loader_blockG { background-color: #666; border: 1px solid #999; float: left; height: 36px; margin-left: 3px; width: 10px; opacity: 0.1; -moz-animation-name: bounceG; -moz-animation-duration: 1.3s; -moz-animation-iteration-count: infinite; -moz-animation-direction: linear; -moz-transform: scale(0.7); -webkit-animation-name: bounceG; -webkit-animation-duration: 1.3s; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: linear; -webkit-transform: scale(0.7); -ms-animation-name: bounceG; -ms-animation-duration: 1.3s; -ms-animation-iteration-count: infinite; -ms-animation-direction: linear; -ms-transform: scale(0.7); -o-animation-name: bounceG; -o-animation-duration: 1.3s; -o-animation-iteration-count: infinite; -o-animation-direction: linear; -o-transform: scale(0.7); animation-name: bounceG; animation-duration: 1.3s; animation-iteration-count: infinite; animation-direction: linear; transform: scale(0.7); } .themify-loader_1 { -moz-animation-delay: 0.39s; -webkit-animation-delay: 0.39s; -ms-animation-delay: 0.39s; -o-animation-delay: 0.39s; animation-delay: 0.39s; } .themify-loader_2 { -moz-animation-delay: 0.52s; -webkit-animation-delay: 0.52s; -ms-animation-delay: 0.52s; -o-animation-delay: 0.52s; animation-delay: 0.52s; } .themify-loader_3 { -moz-animation-delay: 0.65s; -webkit-animation-delay: 0.65s; -ms-animation-delay: 0.65s; -o-animation-delay: 0.65s; animation-delay: 0.65s; } @-moz-keyframes bounceG { 0% { -moz-transform: scale(1.2); opacity: 1; } 100% { -moz-transform: scale(0.7); opacity: 0.1; } } @-webkit-keyframes bounceG { 0% { -webkit-transform: scale(1.2); opacity: 1; } 100% { -webkit-transform: scale(0.7); opacity: 0.1; } } @-ms-keyframes bounceG { 0% { -ms-transform: scale(1.2); opacity: 1; } 100% { -ms-transform: scale(0.7); opacity: 0.1; } } @-o-keyframes bounceG { 0% { -o-transform: scale(1.2); opacity: 1; } 100% { -o-transform: scale(0.7); opacity: 0.1; } } @keyframes bounceG { 0% { transform: scale(1.2); opacity: 1; } 100% { transform: scale(0.7); opacity: 0.1; } } /************************************************************************************ TRANSITION / ANIMATION *************************************************************************************/ /* Transition class */ .transition-active .fly-in .post, .transition-active .fade-in .post, .transition-active .col4-3.fly-in, .transition-active .col4-3.fade-in, .transition-active .col4-2.fly-in, .transition-active .col4-2.fade-in, .transition-active .col4-1.fly-in, .transition-active .col4-1.fade-in, .transition-active .col3-2.fly-in, .transition-active .col3-2.fade-in, .transition-active .col3-1.fly-in, .transition-active .col3-1.fade-in, .transition-active .col2-1.fly-in, .transition-active .col2-1.fade-in, .query-section.transition-active .section-post .section-title, .query-section.transition-active .section-post .section-content { opacity: 0; } /* transition done */ .transition-active .fly-in.shown .post, .transition-active .fade-in.shown .post, .transition-active .col4-3.fly-in.shown, .transition-active .col4-3.fade-in.shown, .transition-active .col4-2.fly-in.shown, .transition-active .col4-2.fade-in.shown, .transition-active .col4-1.fly-in.shown, .transition-active .col4-1.fade-in.shown, .transition-active .col3-2.fly-in.shown, .transition-active .col3-2.fade-in.shown, .transition-active .col3-1.fly-in.shown, .transition-active .col3-1.fade-in.shown, .transition-active .col2-1.fly-in.shown, .transition-active .col2-1.fade-in.shown, .query-section.transition-active .section-post .section-title.shown, .query-section.transition-active .section-post .section-content.shown { -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none; opacity: 1; } /* section animation */ .animated { -webkit-backface-visibility: hidden; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /* FLY IN ANIMATION */ .animate-run .post, .col2-1.animate-run, .col3-2.animate-run, .col3-1.animate-run, .col4-3.animate-run, .col4-2.animate-run, .col4-1.animate-run, .col-full.animate-run { -webkit-backface-visibility: hidden; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /* element first */ .grid4.fly-in.animate-run .post:nth-of-type(4n+1), .grid3.fly-in.animate-run .post:nth-of-type(3n+1), .grid2.fly-in.animate-run .post:nth-of-type(2n+1), .grid2-thumb.fly-in.animate-run .post:nth-of-type(2n+1), .list-post.fly-in.animate-run .post:nth-of-type(2n+1), .col2-1.first.fly-in.animate-run, .col3-2.first.fly-in.animate-run, .col3-1.first.fly-in.animate-run, .col4-3.first.fly-in.animate-run, .col4-2.first.fly-in.animate-run, .col4-1.first.fly-in.animate-run, .col-full.animate-first.fly-in.animate-run { -webkit-animation-name: flyInLeft; animation-name: flyInLeft; } /* element last */ .grid4.fly-in.animate-run .post:nth-of-type(4n+4), .grid3.fly-in.animate-run .post:nth-of-type(3n+3), .grid2.fly-in.animate-run .post:nth-of-type(2n+2), .grid2-thumb.fly-in.animate-run .post:nth-of-type(2n+2), .list-post.fly-in.animate-run .post:nth-of-type(2n+2), .col2-1.last.fly-in.animate-run, .col3-2.last.fly-in.animate-run, .col3-1.last.fly-in.animate-run, .col4-3.last.fly-in.animate-run, .col4-2.last.fly-in.animate-run, .col4-1.last.fly-in.animate-run, .col-full.animate-last.fly-in.animate-run { -webkit-animation-name: flyInRight; animation-name: flyInRight; } /* element first second */ .grid4.fly-in.animate-run .post:nth-of-type(4n+2), .col4-1.second.fly-in.animate-run { -webkit-animation-name: flyInLeftSecond; animation-name: flyInLeftSecond; } /* element last second */ .grid4.fly-in.animate-run .post:nth-of-type(4n+3), .col4-1.third.fly-in.animate-run { -webkit-animation-name: flyInRightSecond; animation-name: flyInRightSecond; } /* element middle */ .grid3.fly-in.animate-run .post:nth-of-type(3n+2), .col4-2.second.fly-in.animate-run, .col3-1.second.fly-in.animate-run { -webkit-animation-name: flyInBottom; animation-name: flyInBottom; } /* Fade In animation */ .grid4.fade-in.animate-run .post, .grid3.fade-in.animate-run .post, .grid2.fade-in.animate-run .post, .grid2-thumb.fade-in.animate-run .post, .list-post.fade-in.animate-run .post, .col4-3.fade-in.animate-run, .col4-2.fade-in.animate-run, .col4-1.fade-in.animate-run, .col3-2.fade-in.animate-run, .col3-1.fade-in.animate-run, .col2-1.fade-in.animate-run, .col-full.fade-in.animate-run { -webkit-transition: opacity 0.5s ease-in; -moz-transition: opacity 0.5s ease-in; -o-transition: opacity 0.5s ease-in; opacity: 1 !important; } /* All animation */ input[type=reset], input[type=submit], button, #main-nav ul, #main-nav a, a.shortcode.button, .portfolio .post-image img, .testimonial-pager span a img, .section-post.gallery .gallery-slider-thumbs li a img { -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } .flyInBottom { -webkit-animation-name: flyInBottom; animation-name: flyInBottom; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes flyInLeft { 0% { opacity: 0; -webkit-transform: translate(-400px, 200px); -ms-transform: translate(-400px, 200px); transform: translate(-400px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes flyInLeft { 0% { opacity: 0; -webkit-transform: translate(-400px, 200px); -ms-transform: translate(-400px, 200px); transform: translate(-400px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @-webkit-keyframes flyInRight { 0% { opacity: 0; -webkit-transform: translate(400px, 200px); -ms-transform: translate(400px, 200px); transform: translate(400px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes flyInRight { 0% { opacity: 0; -webkit-transform: translate(400px, 200px); -ms-transform: translate(400px, 200px); transform: translate(400px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @-webkit-keyframes flyInLeftSecond { 0% { opacity: 0; -webkit-transform: translate(-200px, 200px); -ms-transform: translate(-200px, 200px); transform: translate(-200px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes flyInLeftSecond { 0% { opacity: 0; -webkit-transform: translate(-200px, 200px); -ms-transform: translate(-200px, 200px); transform: translate(-200px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @-webkit-keyframes flyInRightSecond { 0% { opacity: 0; -webkit-transform: translate(200px, 200px); -ms-transform: translate(200px, 200px); transform: translate(200px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes flyInRightSecond { 0% { opacity: 0; -webkit-transform: translate(200px, 200px); -ms-transform: translate(200px, 200px); transform: translate(200px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @-webkit-keyframes flyInBottom { 0% { opacity: 0; -webkit-transform: translate(0px, 200px); -ms-transform: translate(0px, 200px); transform: translate(0px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } @keyframes flyInBottom { 0% { opacity: 0; -webkit-transform: translate(0px, 200px); -ms-transform: translate(0px, 200px); transform: translate(0px, 200px); } 100% { opacity: 1; -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); } } /************************************************************************************ ICON FONT *************************************************************************************/ .carousel-prev:after, .carousel-next:after, #footer-tab a:after, .gallery-slider-next:after, .gallery-slider-prev:after, #menu-icon:after, #menu-icon-close:after, #main-nav .menu-item-has-children > a:after, #main-nav .has-sub-menu > a:after, #main-nav ul .menu-item-has-children > a:after, #main-nav .page_item_has_children > a:after, #main-nav ul .has-sub-menu > a:after { font-family: 'fontello'; } .social-widget li a:after, .social-widget .rss a:before { font-family: FontAwesome; }